<%--
  Created by IntelliJ IDEA.
  User: asd73
  Date: 2017/9/21
  Time: 22:54
  To change this template use File | Settings | File Templates.
  jq控制html的内容
--%>

<%--jq的排它--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript" src="../js/jquery.js"></script>
<%--    <style type="text/css">
        div{width: 300px; height: 300px;background: pink;}
    </style>--%>
    <script type="text/javascript">
        $(function (e) {
            $('ul li').click(function () {
                $(this).css('background','pink');  //$(this)先把DOM转为jquery对象再对他进行操作
                $(this).siblings().css('background','#fff')//把除了子集以外的标签变为白色
            })
        });
    </script>
</head>
<body>
    <ul>
        <li>我是li</li>
        <li>我是li</li>
        <li>我是li</li>
        <li>我是li</li>
        <li>我是li</li>
    </ul>
</body>
</html>
